<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="css/bootstrap.min.css" />
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/bootstrap-dropdown.js"></script>
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
	<script type="text/javascript" src="https://raw.github.com/HPNeo/gmaps/master/gmaps.js"></script>
	<script type="text/javascript" src="js/bootstrap-modal.js"></script>
	<script type="text/javascript" src="js/bootstrap-transition.js"></script>
	<script type="text/javascript" src="js/bootstrap-alert.js"></script>
	<style type="text/css">
		body{
			margin-top:50px;
		}
		.page-header{
			background-color:rgb(240, 245, 248);
		}
		
	</style>
	
</head>
<body>
	<div class="navbar navbar-fixed-top">
	  <div class="navbar-inner">
		<div class="container">
			<a class="brand" href="#">
			  <img src="img/user_group.png" alt="" />&nbsp;客户关系管理系统
			</a>
			<ul class="nav">
			  <li>
				<a href="welcome.action">概览</a>
			  </li>
			  <li  class="active"><a href="contacts.action">通讯录</a></li>
			  <li><a href="tasks.action">任务</a></li>
			  <li><a href="chances.action">机会</a></li>
			  <li><a href="discuss.action">讨论</a></li>
			  <li class="dropdown" id="menutest1">
				<a class="dropdown-toggle" data-toggle="dropdown" href="#menutest1">
				  添加
				  <b class="caret"></b>
				</a>
				<ul class="dropdown-menu">
				  <li><a href="new_contact.action"><i class="icon-user"></i>&nbsp;联系人</a></li>
				  <li><a href="new_company.action"><i class="icon-home"></i>&nbsp;公司</a></li>
				  <li class="divider"></li>
				  <li><a href="new_task.action"><i class="icon-ok"></i>&nbsp;任务</a></li>
				  <li><a href="new_chance.action"><i class="icon-star-empty"></i>&nbsp;机会</a></li>
				</ul>
			  </li>
			  
			</ul>
			
			<ul class="nav pull-right" >
			  <li>
				<a href="#">${sessionScope.user.username }</a>
			  </li>
			  <li class="dropdown" id="menutest2">
				<a class="dropdown-toggle" data-toggle="dropdown" href="#menutest2">
				  管理
				  <b class="caret"></b>
				</a>
				<ul class="dropdown-menu">
				   <li><a href="manage_user.action?id=${sessionScope.user.id }"><i class="icon-user"></i>&nbsp;同事</a></li>
				  <li><a href="manage_group.action"><i class="icon-list-alt"></i>&nbsp;组</a></li>
				  <li class="divider"></li>
				<!--  <li><a href="user_update_user.action?id=${sessionScope.user.id }"><i class="icon-asterisk"></i>&nbsp;账号</a></li> -->
				  <li><a href="show_user_msg.action?id=${sessionScope.user.id }"><i class="icon-asterisk"></i>&nbsp;账号</a></li>
				</ul>
			  </li>
			  <li class="divider-vertical"></li>
			  <li><a href="sign_in.action">退出</a></li>
			</ul>
			
		</div>
	  </div>
	</div>
	
	<div class="container">
		
			<div class="row">
				  <div class="span2"></div>
				  <div class="span8">
					
						<div class="page-header well">
						  <h2><img src="img/contact_list.png" alt="" />&nbsp;通讯录</h2>
						</div>	
						
						<c:if test="${code == '10001' }">
								<div class="alert alert-info  fade in">
								<a class="close" data-dismiss="alert" href="#">&times;</a>
								 		暂无任何联系对象！！！
								</div>
							</c:if>
							<c:if test="${code == '10002' }">
								<div class="alert alert-success  fade in">
								<a class="close" data-dismiss="alert" href="#">&times;</a>
								 		新建联系对象成功！！！
								</div>
							</c:if>
							<c:if test="${code == '10003' }">
								<div class="alert alert-success  fade in">
								<a class="close" data-dismiss="alert" href="#">&times;</a>
								 		导入联系对象成功！！！
								</div>
							</c:if>
							<c:if test="${code == '10004' }">
								<div class="alert alert-success  fade in">
								<a class="close" data-dismiss="alert" href="#">&times;</a>
								 		导出联系对象成功！！！
								</div>
							</c:if>
						
						<div class="page-header well">
							<table class="table">
							  <tbody>
							  		<tr >
							  			<td>联系对象</td>
							  			<td>创建时间</td>
							  			<td>负责人</td>
							  		</tr>
							  	
							  		
							  		<c:forEach items="${contactsList }" var="contact">
									<c:if test="${contact.view == 'all' }">
								
									<tr>
									  <td>
										<c:choose>
												<c:when test="${contact.name == null}"><img src="img/company.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.companyname }</c:when>
												<c:when test="${contact.name != null }"><img src="img/contact.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.name }</c:when>
										</c:choose>
									</td>
									<td>
										${contact.createtime }
									</td>
									<td><a href="show_user_msg.action?id=${sessionScope.user.id }">${contact.user.username }</a></td>
									</tr>
									
								</c:if>

								<c:if test="${contact.view == 'me' }">
									<c:if test="${contact.user.id == user.id }">
										<tr>
										  <td>
											<c:choose>
													<c:when test="${contact.name == null}"><img src="img/company.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.companyname }</c:when>
													<c:when test="${contact.name != null }"><img src="img/contact.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.name }</c:when>
											</c:choose>
										</td>
										<td>
											${contact.createtime }
										</td>
										<td><a href="show_user_msg.action?id=${sessionScope.user.id }">${contact.user.username }</a></td>
										</tr>
									</c:if>
								</c:if>
								
								<c:if test="${contact.view  != 'all' and contact.view != 'me'}">
									<c:if test="${contact.user.id == user.id }">
									<tr>
									  <td>
										<c:choose>
												<c:when test="${contact.name == null}"><img src="img/company.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.companyname }</c:when>
												<c:when test="${contact.name != null }"><img src="img/contact.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.name }</c:when>
										</c:choose>
									</td>
									<td>
										${contact.createtime }
									</td>
									<td><a href="show_user_msg.action?id=${sessionScope.user.id }">${contact.user.username }</a></td>
									</tr>
									</c:if>
								</c:if>
								
								<c:if test="${contact.view  != 'all' and contact.view != 'me'}">
									<c:if test="${contact.view == userGroup.groupname  and contact.user.id != user.id}">
									<tr>
									  <td>
										<c:choose>
												<c:when test="${contact.name == null}"><img src="img/company.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.companyname }</c:when>
												<c:when test="${contact.name != null }"><img src="img/contact.png" alt="" /><a href="show_contact.action?id=${contact.id}">&nbsp;&nbsp;${contact.name }</c:when>
										</c:choose>
									</td>
									<td>
										${contact.createtime }
									</td>
									<td><a href="show_user_msg.action?id=${sessionScope.user.id }">${contact.user.username }</a></td>
									</tr>
									</c:if>
								</c:if>
									
								
								</c:forEach>
									
									
								
							  </tbody>
							</table>
						</div>	
						
								<Script Language="JavaScript" type="text/JavaScript" src="js/showo_page.js"></Script>
					          
					<%-- 效果2:记录总数${pager.totalCount},每页${pager.pageSize}记录,前后显示4个<br>&nbsp;&nbsp;&nbsp; --%>
					<Script Language=JavaScript>
					   ShowoPage("","","<span style='margin-left:80px;'>页次:</span><font color='red'>","</font>/","<font color='red'>","</font>页&nbsp;","&nbsp;每页<font color='red'>","</font>条&nbsp;","&nbsp;共<font color='red'>","</font>个记录&nbsp;&nbsp;","首页","上一页","下一页","尾页","&nbsp;&nbsp;<br/><br/>&nbsp;&nbsp;&nbsp;&nbsp;<span style='margin-left:150px;'>跳转</span>:","<font color='red'>","</font>","[<font color='red'>","</font>]","","","&nbsp;","&nbsp;","${pager.totalCount}","${pager.pageSize}",3)
					</Script> 	
						
						
				  </div>
				  <div class="span4">
				  		
						  
						<div class="page-header well">
							<table class="table">
								<h3>通讯录管理</h3>
							  <tbody>
								<tr>
								  <td><img src="img/contacts.png" alt="" /><a href="new_contact.action">添加联系人</a></td>
								</tr>
								<tr>
								  <td><img src="img/company.png" alt="" /><a href="new_company.action">添加公司</a></td>
								</tr>
								<tr>
								  <td><img src="img/company.png" alt="" /><a href="show_delete_contacts.action">修改联系对象</a></td>
								</tr>
								<tr>
								  <td><img src="img/company.png" alt="" /><a href="show_delete_contacts.action">删除联系对象</a></td>
								</tr>
								<tr>
								  <td><img src="img/company.png" alt="" /><a href="show_back_contacts.action">恢复联系对象</a></td>
								</tr>
								<tr>
								  <td><img src="img/export_to_document.png" alt="" />
											<a  data-toggle="modal" href="#myModal" >点击导入联系人</a>
	
												<div class="modal fade" id="myModal">
												  <div class="modal-header">
													<a class="close" data-dismiss="modal"><img src="img/cancel-import.png"></a>
													<h3>您的联系人文件放入C盘import文件夹中了吗？</h3>
												  </div>
													 <form novalidate="novalidate" method="post" id="user-form" class="simple_form well" action="import_contacts.action" accept-charset="UTF-8"><div style="margin:0;padding:0;display:inline"><input type="hidden" value="✓" name="utf8"><input type="hidden" value="y27zJQeqxEC1a5ndwzOvNh+/zsUoKoR8yeyGZRDmpus=" name="authenticity_token"></div>
												  <div class="modal-body">
													 
														  <div class="control-group email required"><div class="controls"><input type="text" value="" size="50" placeholder="要导入的联系人文件名" name="import_name" id="user_email" class="string email required span3"></div></div>
												  </div>
												  <div class="modal-footer">
													<input name="" class="btn btn-primary" type="submit" value="导入"/>
													<a href="#" class="btn"   data-dismiss="modal">取消</a>
												  </div>
														</form>
												</div>
								  </td>
								</tr>
								<tr>
								  <td><img src="img/export.png" alt="" />
								  			
								  			<a  data-toggle="modal" href="#exportModal" >点击导出联系人</a>
	
												<div class="modal fade" id="exportModal">
												  <div class="modal-header">
													<a class="close" data-dismiss="modal"><img src="img/cancel-import.png"></a>
													<h3>导出的联系人文件默认存在C盘export文件夹中！</h3>
												  </div>
													 <form novalidate="novalidate" method="post" id="user-form" class="simple_form well" action="export_contacts.action" accept-charset="UTF-8"><div style="margin:0;padding:0;display:inline"><input type="hidden" value="✓" name="utf8"><input type="hidden" value="y27zJQeqxEC1a5ndwzOvNh+/zsUoKoR8yeyGZRDmpus=" name="authenticity_token"></div>
												  <div class="modal-body">
													 
														  <div class="control-group email required"><div class="controls"><input type="text" value="" size="50" placeholder="请给导出的联系人文件命名" name="export_name" id="user_email" class="string email required span3"></div></div>
												  </div>
												  <div class="modal-footer">
													<input name="" class="btn btn-primary" type="submit" value="导出"/>
													<a href="#" class="btn"   data-dismiss="modal">取消</a>
												  </div>
														</form>
												</div>
								  
								  </td>
								</tr>
							  </tbody>
							</table>
						</div>	
						<input type="text"   name="" id="address"  value="" />
						<input  type="button" value="显示地图" id="btn" />
						<div id="map" style="width:303px;height:338px"></div>
									
						
						
					  </div>
					</div>
			</div>
			
			
	
		</div>
		
	<script type="text/javascript">
		$(document).ready(function(){
			
			$(".alert").alert();
			
			map = new GMaps({
					div: '#map',
					lat: 35.2193612,
					lng: 113.2482923 
			});

				$("#btn").click(function(){
				GMaps.geocode({
				  address: $('#address').val(),
				  callback: function(results, status) {
					if (status == 'OK') {
					  var latlng = results[0].geometry.location;
					  map.setCenter(latlng.lat(), latlng.lng());
					  map.addMarker({
						lat: latlng.lat(),
						lng: latlng.lng()
					  });
					}
				  }
				});
			});
			
		
			$("#new_task").click(function(){
				$('#myModal').modal({
					backdrop:true,
					keyboard:true,
					show:false
				});
			});
			
			$('#myModal').modal({
				backdrop:true,
				keyboard:true,
				show:false
			});
			
		});
		
	</script>
</body>
</html>